Skip to main content

Layout

The Layout component organizes its children into a customizable layout, with options for defining the structure, behavior, and styles.

Properties​

Data Properties​

  • Setup: Configuration object defining the initial layout structure.

    {
      "tabs": {
        "": [
          {
            "extent": 1,
            "weight": 0,
            "cols": [
              {
                "extent": 1
              }
            ]
          }
        ]
      }
    }

Behavior Properties​

  • Table Style: A boolean value indicating whether to apply a table style to the layout. The default value is false.

  • Show Lines: A boolean value indicating whether to display helper lines in the layout. The default value is true.

  • Display: Specifies the display mode for the columns. The possible values are:

    • fluid: Columns have a fluid width.
    • rigid: Columns have equal width.
    "display": "fluid"

Style Properties​

  • Gap: The space between components in the layout, specified as a number. The default value is 2.

  • Padding: The padding around the layout, specified as a number. The default value is 2.

  • Min Height: The minimum height of the layout, specified as a number. The default value is 100.

Tabs Properties​

  • Tabs: An array of strings representing the tabs in the layout. The default value is [].

  • Selected Tab: The ID of the active tab, specified as a string. The default value is "".

Collapsible Properties​

  • Is Collapsible: A boolean value indicating whether the layout can be collapsed. The default value is false.

  • Is Collapsed: A boolean value indicating whether the layout is collapsed. The default value is false.

  • Collapse Title: The title of the collapsible section, specified as a string. The default value is Title.